<script>

    function populateUserTarget(){
        var arrayParam;
        $("#table").show();
        $(".wide").empty();

        $.ajax({
            url: "<?php echo base_url(); ?>index.php/target/getUserTarget/"+$('#user_group').val()+"/"+$('#month').val(),
            dataType:"json",
            success:function(data){
                kpi_code = "0";
                x=0;
                $.each(data.data, function(i,n){
                    if(kpi_code!=n["kpi_code"]){
                        if (kpi_code!="0")
                        {
                            row="<tr class='wide' style='padding:5px'><td colspan='5'>--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------</td></tr>";
                        }
                        else{
                            row="";
                        }
                        add_tuple =  "<tr id='"+n["kpi_code"]+"-"+n["user_id"]+"' class='wide' style='padding:5px' >"+
                                "<td><label for='lbl"+n["kpi_code"]+"-"+n["user_id"]+"'>"+n["kpi_code"]+"</label></td>"+
                                "<td><label for='desc"+n["kpi_code"]+"-"+n["user_id"]+"'>"+n["kpi_description"]+"</label></td>"+
                                "<td><label for='name"+n["kpi_code"]+"-"+n["user_id"]+"'>"+n["user_name"]+"</label></td>"+
                                "<td><div class='input'><input type='text' id='"+n["kpi_code"]+"-"+n["user_id"]+"' name='"+n["kpi_code"]+"-"+n["user_id"]+"' class='medium' style='text-align:right;' value='"+n["kpi_target"]+"' /> "+n["remark"]+" </div></td>" +
                                "</tr>";
                    $('#table-updateable').append(row+add_tuple);
                    kpi_code=n["kpi_code"];
                     x=0;
                    } else {
                        if (x==0){
                            add_tuple = "<tr id='"+n["kpi_code"]+"-"+n["user_id"]+"' class='wide' style='padding:5px'>"+
                                "<td><label for='lbl'>Target Alokasi</label></td>"+
                                "<td><div id='tarloc"+kpi_code+"' ></td>"+
                                "<td><label for='name"+n["kpi_code"]+"-"+n["user_id"]+"'>"+n["user_name"]+"</label></td>"+
                                "<td><div class='input'><input type='text' id='"+n["kpi_code"]+"-"+n["user_id"]+"' name='"+n["kpi_code"]+"-"+n["user_id"]+"' class='medium' style='text-align:right;' value='"+n["kpi_target"]+"'  /> "+n["remark"]+" </div></td>" +
                                "</tr>";
                        }
                        else{
                            
                        add_tuple = "<tr id='"+n["kpi_code"]+"-"+n["user_id"]+"' class='wide' style='padding:5px'>"+
                                "<td><label for='lbl"+n["kpi_code"]+"-"+n["user_id"]+"'></label></td>"+
                                "<td><label for='desc"+n["kpi_code"]+"-"+n["user_id"]+"'></label></td>"+
                                "<td><label for='name"+n["kpi_code"]+"-"+n["user_id"]+"'>"+n["user_name"]+"</label></td>"+
                                "<td><div class='input'><input type='text' id='"+n["kpi_code"]+"-"+n["user_id"]+"' name='"+n["kpi_code"]+"-"+n["user_id"]+"' class='medium' style='text-align:right;' value='"+n["kpi_target"]+"' /> "+n["remark"]+" </div></td>" +
                                "</tr>";
                        
                        }
                        $('#table-updateable').append(add_tuple);
                        x=1;
                        
                    }
                });
                $('#buttons').html(" <input type='submit' name='submit' value='"+data.status+"'/>"+
                                    "<input type='reset' name='reset' value='Reset' onclick='$('#table').hide(); $('.wide').empty();'/>"
                  
                
                )
            },
            error: function(data){
            }
       });  
       
       $.ajax({
            url: "<?php echo base_url(); ?>index.php/target/getTargetAllocation/"+$('#month').val(),
            dataType:"json",
            success:function(datas){
                  $.each(datas, function(i,n){
                        $('#tarloc'+n['kpi_code']).html(n['target']);
                    });
            },
            error: function(datas){
            }
       });  
       
    }
</script>

<div class="box">
    <!-- box / title -->
    <div class="title">
        <h5>Penugasan Target</h5>               
    </div>
    <!-- end box / title -->
        
   <!-- <form id="form-target-assignment" action="<?=$_SERVER['PHP_SELF']?>" method="post">
        <div class="form">
            <div class="fields">
                <div class="field">
                    <div class="label">
                        <label for="start">Bulan : </label> <br /><br /><br />
                         <label for="user_group" style="top: 10px;">Grup Pengguna : </label>
                    </div>
                    <div style="" class="input" >                    
                        <select name="month" id="month" class="medium"  onchange="populateUserTarget();" >
                            <option value="">Pilih</option>
                        	<?php 
                                $y=date('Y');
                                $m=date('m')+1;
                                $bln["01"]="Januari";
            					$bln["02"]="Februari";
            					$bln["03"]="Maret";
            					$bln["04"]="April";
            					$bln["05"]="Mei";
            					$bln["06"]="Juni";
            					$bln["07"]="Juli";
            					$bln["08"]="Agustus";
            					$bln["09"]="September";
            					$bln["10"]="Oktober";
            					$bln["11"]="November";
            					$bln["12"]="Desember";
            					for($i=1;$i<=6;$i++){
                                    if ($m <10)
                                        $m="0".$m;
                                    echo "<option value=". $y.$m .">".$bln[$m]." ". $y ."</option>";
                                    if($m==12){
                                        $y++;
                                        $m="01";
                                    } else {
                                        $m++;
                                    }
                                }
                            ?>
                        </select>
                        <br />
                        <select name="user_group" id="user_group" class="medium" onchange="populateUserTarget();" style="margin-top: 10px;" >
                            <option value="8">SmartFren Ambassador</option>
                            <option value="9">Direct Sales</option>
                        </select>
                    </div>
                </div>
            </div>
            <div id="notices" style="clear: both;" >
                <label id="notice"></label>
            </div>
            <div id="table" style="clear: both; padding: 20px;">
                <table id="table-updateable" width="100%" style="padding: 5px;"  ></table>
            </div>
          
            <div id="buttons" class="buttons" style="clear: both;">
                             
            </div>
        </div>
    </form>!-->
          
    <div class="table" style="padding-top: 10px;">
        <base href="<?php echo base_url() ?>" />
        <div id="ajaxLoadAni">
            <img src="file/smooth/images/ajax-loader.gif" alt="Ajax Loading Animation" />
            <span>Loading...</span>
        </div>
        <table id="records">
            <thead>
                <tr  >
                    <th>No</th>
                    <th>NIK</th>
                    <th>Nama Karyawan</th>
                    <th>Kode KPI</th>
                    <th>Bulan</th>
                    <th>Tahun</th>
                    <th>Target</th>
                   <!-- <th>Aksi</th> -->      
                </tr>
            </thead>
            <tbody></tbody>
        </table>
        <?=$this->load->view("grid-target-assign");?>
    </div>
</div>